<template>
  <section class="voucher-detail">
    <info :clientInfo="clientInfo" tagText="一般纳税人" />
    <div class="data-content">
      <div class="btns-content">
        <el-button @click="save" icon="el-icon-document-checked" size="small" type="primary">
          保存
        </el-button>
        <el-button @click="back" icon="el-icon-document-checked" size="small">
          返回
        </el-button>
      </div>
      <el-table :data="tableData" tooltip-effect="dark" size="mini" border>
        <el-table-column
          prop="type"
          label="类别"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="项目"
          align="center"
        ></el-table-column>
        <el-table-column prop="count" label="份数" align="center">
          <template slot-scope="scope">
            <el-input
              align="center"
              v-model="scope.row.count"
              type="number"
              @input.native="onInput"
              v-if="scope.row.count !== '\\' && !scope.row.isNoEdit"
            ></el-input>
            <template v-else>{{ scope.row.count }}</template>
          </template>
        </el-table-column>
        <el-table-column prop="amountSum" label="金额" align="center">
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.amountSum"
              type="number"
              @input.native="onInput"
              v-if="scope.row.amountSum !== '\\' && !scope.row.isNoEdit"
            ></el-input>
            <template v-else>{{ scope.row.amountSum }}</template>
          </template>
        </el-table-column>
        <el-table-column prop="taxSum" label="税额" align="center">
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.taxSum"
              type="number"
              @input.native="onInput"
              v-if="scope.row.taxSum !== '\\' && !scope.row.isNoEdit"
            ></el-input>
            <template v-else>{{ scope.row.taxSum }}</template>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </section>
</template>


<script>
import info from "@/components/infoHeader";
import utiles from '@/components/utiles';
// import { version } from 'xlsx/types';

const names = {
  specialVatInvoice: "已认证的增值税专用发票",
  otherDeductItem: "其他抵扣项",
  inTaxOutItem: "进项税额转出",
  totalItem: "总计",
};
export default {
  data() {
    return {
      clientInfo: {},
      currentUser: {},
      tableData: [
        // {
        //   type: "已认证的增值税专用发票",
        //   subjectName: "销项税额之和",
        //   num: "\\",
        //   amount: "\\",
        //   taxAmount: 0,
        //   rowSpan: 2,
        //   key: "outSumItem",
        // },
        // {
        //   type: "已认证的增值税专用发票",
        //   subjectName: "进行发票抵扣",
        //   num: "\\",
        //   amount: "\\",
        //   taxAmount: 0,
        //   key: "inSumItem",
        // },
        {
          type: "其他抵扣项",
          name: "农产品收购或销售发票",
          count: "",
          amountSum: 0,
          taxSum: 0,
          rowSpan: 3,
          key: 0,
        },
        {
          type: "其他抵扣项",
          name: "用于构建不动产的报税凭证",
          count: "",
          amountSum: 0,
          taxSum: 0,
          key: 1,
        },
        {
          type: "其他抵扣项",
          name: "用于抵扣的旅客运输服务的凭证",
          count: "",
          amountSum: 0,
          taxSum: 0,
          key: 2,
        },
        {
          type: "进项税额转出",
          name: "红字专用发票信息表标注的进项税额",
          count: "\\",
          amountSum: "\\",
          taxSum: 0,
          key: 3,
        },
        {
          type: "总计",
          name: "",
          count: "\\",
          amountSum: "\\",
          taxSum: 0,
          isNoEdit: true,
          key: "totalItem",
        },
      ],
    };
  },
  components: {
    info,
  },
  created() {
    const data = localStorage.getItem("valueAddedTaxDetail");
    if (data) {
      this.clientInfo = JSON.parse(data);
      this.currentUser = utiles.getCurrentUser();
      this.loadData();
    }
  },
  methods: {
    save() {
      const { tableData } = this;
      // const data = JSON.parse(JSON.stringify(tableData));

      const result = {
        // specialVatInvoice: {},
        // otherDeductItem: {},
      };
      let postData = [];
      tableData.forEach((v) => {
        // const topInfo = v.parentKey ? result[v.parentKey] : result;
        // const data = {
        //   name: v.name,
        //   taxSum: parseFloat(v.taxSum),
        // };
        if (v.count !== "\\") {
          v.count = parseInt(v.count);
        }
        if (v.amountSum !== "\\") {
          v.amountSum = parseFloat(v.amountSum);
        }
        if (v.count == "\\") {
          v.count = 0;
        }
        if (v.amountSum == "\\") {
          v.amountSum = 0;
        }
        // topInfo[v.key] = data;
        if (v.type != "总计"){
          postData.push(v)
        }
      });
      let postDataStr = JSON.stringify(postData);
      console.log("编辑特殊抵扣项：", postDataStr);
      this.$http
        .post("/incomeTax/updateTaxSummary", {
          cName: this.clientInfo.cName,
          bName: this.clientInfo.bName,
          data: postDataStr,
        })
        .then((res) => {
          // if (res.data.result) {
          //   tableData[tableData.length - 1].taxSum =
          //     res.data.result.totalItem.taxSum;
          // }
          if (res.code != 0){
            this.$message.error("保存失败", res.message);
          } else {
            this.$message.success("保存成功");
            this.back();
          }
        });
    },
    arraySpanMethod({ row, _column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (row.rowSpan) {
          return [row.rowSpan, 1];
        } else {
          return [0, 0];
        }
      }
    },
    onInput(e) {
      // clearTimeout(this.timer);
      // this.timer = setTimeout(() => {
      //   this.save();
      // }, 600);
    },
    loadData() {
      const { tableData } = this;
      this.$http
        .get("/incomeTax/taxSummary", {
          params: {
            bName: this.clientInfo.bName,
            cName: this.clientInfo.cName,
          },
        })
        .then((res) => {
          const list = [];
          const d = res.data;
          let totalTaxSum = 0;
          Object.keys(d).forEach((v) => {
            const info = d[v];
            if (info.name) {
              const item = tableData.find((item) => item.key == v);
              if (item) {
                item.name = info.name;
                item.taxSum = info.taxSum;
                if (item.name === "红字专用发票信息表标注的进项税额"){
                  item.count = "\\";
                  item.amountSum = "\\";
                } else {
                  item.count = info.count;
                  item.amountSum = info.amountSum;
                }
                // item.type = info.type;
                totalTaxSum += info.taxSum;
              }

  
            } else {
              Object.keys(info).forEach((v2) => {
                const info2 = info[v2];
                if (info2.name) {
                  const item = tableData.find((item) => item.key === v2);
                  if (item) {
                    item.parentKey = v;
                    item.name = info2.name;
                    item.taxSum =
                      info2.taxSum === undefined ? "\\" : info2.taxSum;
                    item.amountSum =
                      info2.amountSum === undefined ? "\\" : info2.amountSum;
                    item.count = info2.count === undefined ? "\\" : info2.count;
                  }
                }
               
              });
            }
            const amountItem = tableData.find((item) => item.type == "总计");
            amountItem.taxSum = Math.round(totalTaxSum*100)/100;
          });
        });
    },
    back(){
      this.$router.back();
    },
  },
};
</script>
<style scoped>
.voucher-detail {
  padding: 0 10px;
}
.header-item {
  font-size: 14px;
  color: #333;
}
.data-content {
  margin-top: 20px;
  padding: 20px 20px 40px;
  background: #fff;
  box-sizing: border-box;
}
.btns-content {
  margin-bottom: 30px;
}
</style>